<template>
  <el-dialog
    title="审核进度"
    :visible.sync="visible"
    width="50%"
    :destroy-on-close="true"
    :before-close="handleClose"
  >
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="当前节点" prop="process">
        <div style="width: 70%;">
          <el-input v-model="form.process" disabled clearable size="small" />
        </div>
      </el-form-item>
      <el-form-item label="下个节点" prop="nextProcess">
        <div style="width: 70%;">
          <el-input v-model="form.nextProcess" disabled clearable size="small" />
        </div>
      </el-form-item>
      <el-form-item v-if="defaultValue.level == 3" label="授信额度" prop="creditLimit" :rules="{ required: true, message: '请输入授信额度'}">
        <div style="width: 70%;">
          <el-input v-model="form.creditLimit" type="number" placeholder="请输入授信额度" size="small" />
        </div>
      </el-form-item>
      <el-form-item label="状态" prop="status" :rules="{ required: true, message: '请选择状态'}">
        <div style="width: 70%;">
          <el-select v-model="form.status" placeholder="请选择" style="width: 100%;" clearable size="small">
            <el-option
              v-for="item in statusOption"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </div>
      </el-form-item>
      <el-form-item label="备注" prop="remark" :rules="{ required: true, message: '请输入备注'}">
        <div style="width: 70%;">
          <el-input v-model="form.remark" type="textarea" placeholder="请输入备注" clearable size="small" />
        </div>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" size="small" :loading="loading" @click="onSubmit">确定</el-button>
        <el-button size="small" @click="handleClose">取消</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>
<script>
import request from '@/utils/request'

export default {
  components: {
    // QuillText
  },
  props: {
    data: {
      type: Object,
      default: () => ({})
    },
    visible: {
      type: Boolean,
      default: false
    },
    defaultValue: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      form: {

      },
      loading: false,
      statusOption: [{ label: '通过', value: '1' }, { label: '驳回', value: '0' }]
    }
  },
  watch: {
    defaultValue(val) {
      console.log(val, '00')

      this.form = {
        process: val.process,
        nextProcess: val.nextProcess,
        id: val.id
      }
    }
  },
  methods: {
    onSubmit() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          const p = {
            id: this.form.id,
            status: this.form.status,
            remark: this.form.remark,
            creditLimit: this.form.creditLimit
          }
          this.request(p)
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },

    async request(params) {
      try {
        this.loading = true
        await request({
          url: 'system/apply/examineApply',
          method: 'post',
          data: params
        })
        this.$message({
          message: params.id ? '修改成功' : '添加成功',
          type: 'success',
          duration: 2000,
          onClose: () => this.$emit('add-success')
        })
      } catch (error) {
        this.$message({
          message: error,
          type: 'warning'
        })
      } finally {
        this.loading = false
      }
    },
    handleClose() {
      this.$emit('close:drawer', false)
    }

  }
}
</script>

<style scoped>
  .item {
    display: flex;
    justify-content: right;
  }
  .required {
    color: red;
  }
</style>
